<!DOCTYPE html>
<html>
<head><meta name="generator" content="Hexo 3.8.0">
    

    
<!-- Tencent Speed -->
<script>var _speedMark = new Date()</script>
<!-- End Tencent Speed -->
<!-- Tencent Analysis -->
<script async src="//tajs.qq.com/stats?sId=false."></script>
<!-- End Tencent Analysis -->


    



    <meta charset="utf-8">
    
    
    <meta name="google-site-verification" content="CUm1VNyzpZuuHWWTWLOVfbkoMiz6Q9ccqUY5rMp9vcI">

    
    
    <title>Hexo 博客搭建指南 | Edward</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    
    <meta name="theme-color" content="#3F51B5">
    
    
    <meta name="keywords" content="hexo">
    <meta name="description" content="Hexo 博客搭建指南1 Hexo介绍Hexo是基于NodeJs的静态博客框架，简单、轻量，其生成的静态网页可以托管在Github和Heroku上。  超快速度 支持MarkDown 一键部署 丰富的插件   下面以我的博客为例，limedroid.github.io  2 环境准备2.1 安装node.js去nodejs官网下载对应系统的安装包，按提示安装。 检验安装成功：1$ node -v">
<meta name="keywords" content="hexo">
<meta property="og:type" content="article">
<meta property="og:title" content="Hexo 博客搭建指南">
<meta property="og:url" content="http://springcloud.xn--ses554g/2020/03/29/Hexo博客搭建指南/index.html">
<meta property="og:site_name" content="Edward">
<meta property="og:description" content="Hexo 博客搭建指南1 Hexo介绍Hexo是基于NodeJs的静态博客框架，简单、轻量，其生成的静态网页可以托管在Github和Heroku上。  超快速度 支持MarkDown 一键部署 丰富的插件   下面以我的博客为例，limedroid.github.io  2 环境准备2.1 安装node.js去nodejs官网下载对应系统的安装包，按提示安装。 检验安装成功：1$ node -v">
<meta property="og:locale" content="default">
<meta property="og:image" content="https://img-blog.csdnimg.cn/20190213143852738.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdfMTIzX3p5,size_16,color_FFFFFF,t_70">
<meta property="og:updated_time" content="2020-03-30T03:11:49.109Z">
<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="Hexo 博客搭建指南">
<meta name="twitter:description" content="Hexo 博客搭建指南1 Hexo介绍Hexo是基于NodeJs的静态博客框架，简单、轻量，其生成的静态网页可以托管在Github和Heroku上。  超快速度 支持MarkDown 一键部署 丰富的插件   下面以我的博客为例，limedroid.github.io  2 环境准备2.1 安装node.js去nodejs官网下载对应系统的安装包，按提示安装。 检验安装成功：1$ node -v">
<meta name="twitter:image" content="https://img-blog.csdnimg.cn/20190213143852738.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdfMTIzX3p5,size_16,color_FFFFFF,t_70">
    
        <link rel="alternate" type="application/atom+xml" title="Edward" href="/atom.xml">
    
    <link rel="shortcut icon" href="/img/favicon.ico">
    <link rel="stylesheet" href="//unpkg.com/hexo-theme-material-indigo@latest/css/style.css">
    <script>window.lazyScripts=[]</script>

    <!-- custom head -->
    

    <script>
        (function(){
            var bp = document.createElement('script');
            var curProtocol = window.location.protocol.split(':')[0];
            if (curProtocol === 'https'){
                bp.src = 'https://zz.bdstatic.com/linksubmit/push.js';
            }
            else{
                bp.src = 'http://push.zhanzhang.baidu.com/push.js';
            }
            var s = document.getElementsByTagName("script")[0];
            s.parentNode.insertBefore(bp, s);
        })();
    </script>

</head>

<body>
    <div id="loading" class="active"></div>

    <aside id="menu">
  <div class="inner flex-row-vertical">
    <a href="javascript:;" class="header-icon waves-effect waves-circle waves-light" id="menu-off">
        <i class="icon icon-lg icon-close"></i>
    </a>
    <div class="brand-wrap" style="background-image:url(/img/brand.jpg)">
      <div class="brand" style="padding-top: 30%;">
        <a href="/" class="avatar waves-effect waves-circle waves-light">
          <img src="/img/123.png">
        </a>
        <hgroup class="introduce">
          <h5 class="nickname">Edward</h5>
          <a href="mailto:zqmssbd@qq.com" title="zqmssbd@qq.com" class="mail">zqmssbd@qq.com</a>
        </hgroup>
      </div>
    </div>
    <div class="scroll-wrap flex-col">
      <ul class="nav">
        
            <li class="waves-block waves-effect">
              <a href="/">
                <i class="icon icon-lg icon-home"></i>
                主页
              </a>
            </li>
          
            <li class="waves-block waves-effect">
              <a href="/archives">
                <i class="icon icon-lg icon-archives"></i>
                Archives
              </a>
            </li>
          
            <li class="waves-block waves-effect">
              <a href="/tags">
                <i class="icon icon-lg icon-tags"></i>
                Tags
              </a>
            </li>
          
            <li class="waves-block waves-effect">
              <a href="/categories">
                <i class="icon icon-lg icon-th-list"></i>
                Categories
              </a>
            </li>
          
            <li class="waves-block waves-effect">
              <a href="https://github.com/zqmssbd" target="_blank">
                <i class="icon icon-lg icon-github"></i>
                Github
              </a>
            </li>
          
            <li class="waves-block waves-effect">
              <a href="https://weibo.com/5333276247" target="_blank">
                <i class="icon icon-lg icon-weibo"></i>
                Weibo
              </a>
            </li>
          
            <li class="waves-block waves-effect">
              <a href="https://gitee.com/Edward-Z" target="_blank">
                <i class="icon icon-lg icon-link"></i>
                码云
              </a>
            </li>
          
      </ul>
        <div id="tp-weather-widget"></div>
        <script>
            (function(a,h,g,f,e,d,c,b){b=function(){d=h.createElement(g);c=h.getElementsByTagName(g)[0];d.src=e;d.charset="utf-8";d.async=1;c.parentNode.insertBefore(d,c)};a["SeniverseWeatherWidgetObject"]=f;a[f]||(a[f]=function(){(a[f].q=a[f].q||[]).push(arguments)});a[f].l=+new Date();if(a.attachEvent){a.attachEvent("onload",b)}else{a.addEventListener("load",b,false)}}(window,document,"script","SeniverseWeatherWidget","//cdn.sencdn.com/widget2/static/js/bundle.js?t="+parseInt((new Date().getTime() / 100000000).toString(),10)));
            window.SeniverseWeatherWidget('show', {
                flavor: "bubble",
                location: "WT3Q0FW9ZJ3Q",
                geolocation: true,
                language: "zh-Hans",
                unit: "c",
                theme: "auto",
                token: "74eabe8a-0b6b-4a56-86ac-c773a4d98218",
                hover: "enabled",
                container: "tp-weather-widget"
            })
        </script>

        <link rel="stylesheet" href="/css/APlayer.css">
        <div id="player" class="aplayer aplayer-withlist aplayer-fixed" data-id="3895885" data-server="netease" data-type="playlist" data-order="random" data-fixed="true" data-listfolded="false" data-theme="#2D8CF0"></div>
        <script src="/js/APlayer.min.js"></script>
        <script src="/js/Meting.min.js"></script>

        


        

    </div>
  </div>
</aside>

    <main id="main">
        <header class="top-header" id="header">
    <div class="flex-row">
        <a href="javascript:;" class="header-icon waves-effect waves-circle waves-light on" id="menu-toggle">
          <i class="icon icon-lg icon-navicon"></i>
        </a>
        <div class="flex-col header-title ellipsis">Hexo 博客搭建指南</div>
        
        <div class="search-wrap" id="search-wrap">
            <a href="javascript:;" class="header-icon waves-effect waves-circle waves-light" id="back">
                <i class="icon icon-lg icon-chevron-left"></i>
            </a>
            <input type="text" id="key" class="search-input" autocomplete="off" placeholder="输入感兴趣的关键字">
            <a href="javascript:;" class="header-icon waves-effect waves-circle waves-light" id="search">
                <i class="icon icon-lg icon-search"></i>
            </a>
        </div>
        
        
        <a href="javascript:;" class="header-icon waves-effect waves-circle waves-light" id="menuShare">
            <i class="icon icon-lg icon-share-alt"></i>
        </a>
        
    </div>
</header>
<header class="content-header post-header">

    <div class="container fade-scale">
        <h1 class="title">Hexo 博客搭建指南</h1>
        <h5 class="title">你真的还不够，不够勤奋和努力。</h5>
        <h5 class="subtitle">
            
                <time datetime="2020-03-29T13:44:22.000Z" itemprop="datePublished" class="page-time">
  2020-03-29
</time>


	<ul class="article-category-list"><li class="article-category-list-item"><a class="article-category-list-link" href="/categories/hexo/">hexo</a></li></ul>

            
        </h5>
    </div>

    

    <script>
        (function(){
            var bp = document.createElement('script');
            var curProtocol = window.location.protocol.split(':')[0];
            if (curProtocol === 'https'){
                bp.src = 'https://zz.bdstatic.com/linksubmit/push.js';
            }
            else{
                bp.src = 'http://push.zhanzhang.baidu.com/push.js';
            }
            var s = document.getElementsByTagName("script")[0];
            s.parentNode.insertBefore(bp, s);
        })();
    </script>
</header>


<div class="container body-wrap">
    
    <aside class="post-widget">
        <nav class="post-toc-wrap post-toc-shrink" id="post-toc">
            <h4>TOC</h4>
            <ol class="post-toc"><li class="post-toc-item post-toc-level-1"><a class="post-toc-link" href="#Hexo-博客搭建指南"><span class="post-toc-number">1.</span> <span class="post-toc-text">Hexo 博客搭建指南</span></a><ol class="post-toc-child"><li class="post-toc-item post-toc-level-2"><a class="post-toc-link" href="#1-Hexo介绍"><span class="post-toc-number">1.1.</span> <span class="post-toc-text">1 Hexo介绍</span></a></li><li class="post-toc-item post-toc-level-2"><a class="post-toc-link" href="#2-环境准备"><span class="post-toc-number">1.2.</span> <span class="post-toc-text">2 环境准备</span></a><ol class="post-toc-child"><li class="post-toc-item post-toc-level-3"><a class="post-toc-link" href="#2-1-安装node-js"><span class="post-toc-number">1.2.1.</span> <span class="post-toc-text">2.1 安装node.js</span></a></li><li class="post-toc-item post-toc-level-3"><a class="post-toc-link" href="#2-2-安装hexo"><span class="post-toc-number">1.2.2.</span> <span class="post-toc-text">2.2 安装hexo</span></a></li></ol></li><li class="post-toc-item post-toc-level-2"><a class="post-toc-link" href="#3-利用Hexo搭建一个博客"><span class="post-toc-number">1.3.</span> <span class="post-toc-text">3 利用Hexo搭建一个博客</span></a><ol class="post-toc-child"><li class="post-toc-item post-toc-level-3"><a class="post-toc-link" href="#3-1-创建博客目录limedroid-github-io"><span class="post-toc-number">1.3.1.</span> <span class="post-toc-text">3.1 创建博客目录limedroid.github.io</span></a></li><li class="post-toc-item post-toc-level-3"><a class="post-toc-link" href="#3-2-生成静态页面"><span class="post-toc-number">1.3.2.</span> <span class="post-toc-text">3.2 生成静态页面</span></a></li><li class="post-toc-item post-toc-level-3"><a class="post-toc-link" href="#3-3-运行"><span class="post-toc-number">1.3.3.</span> <span class="post-toc-text">3.3 运行</span></a></li></ol></li><li class="post-toc-item post-toc-level-2"><a class="post-toc-link" href="#4-发一篇文章试试"><span class="post-toc-number">1.4.</span> <span class="post-toc-text">4 发一篇文章试试</span></a><ol class="post-toc-child"><li class="post-toc-item post-toc-level-3"><a class="post-toc-link" href="#4-1-命令方式"><span class="post-toc-number">1.4.1.</span> <span class="post-toc-text">4.1 命令方式</span></a></li><li class="post-toc-item post-toc-level-3"><a class="post-toc-link" href="#4-2-直接方式"><span class="post-toc-number">1.4.2.</span> <span class="post-toc-text">4.2 直接方式</span></a></li></ol></li><li class="post-toc-item post-toc-level-2"><a class="post-toc-link" href="#5-配置"><span class="post-toc-number">1.5.</span> <span class="post-toc-text">5 配置</span></a></li><li class="post-toc-item post-toc-level-2"><a class="post-toc-link" href="#6-换一个好看的主题"><span class="post-toc-number">1.6.</span> <span class="post-toc-text">6 换一个好看的主题</span></a><ol class="post-toc-child"><li class="post-toc-item post-toc-level-3"><a class="post-toc-link" href="#6-1-下载主题资源"><span class="post-toc-number">1.6.1.</span> <span class="post-toc-text">6.1 下载主题资源</span></a></li><li class="post-toc-item post-toc-level-3"><a class="post-toc-link" href="#6-2-应用下载的主题"><span class="post-toc-number">1.6.2.</span> <span class="post-toc-text">6.2 应用下载的主题</span></a></li><li class="post-toc-item post-toc-level-3"><a class="post-toc-link" href="#6-3-主题其他配置"><span class="post-toc-number">1.6.3.</span> <span class="post-toc-text">6.3 主题其他配置</span></a></li></ol></li><li class="post-toc-item post-toc-level-2"><a class="post-toc-link" href="#7-部署到Github"><span class="post-toc-number">1.7.</span> <span class="post-toc-text">7 部署到Github</span></a><ol class="post-toc-child"><li class="post-toc-item post-toc-level-3"><a class="post-toc-link" href="#7-1-有个github账号xxx"><span class="post-toc-number">1.7.1.</span> <span class="post-toc-text">7.1 有个github账号xxx</span></a></li><li class="post-toc-item post-toc-level-3"><a class="post-toc-link" href="#7-2-创建一个xxx-github-io的public仓库"><span class="post-toc-number">1.7.2.</span> <span class="post-toc-text">7.2 创建一个xxx.github.io的public仓库</span></a></li><li class="post-toc-item post-toc-level-3"><a class="post-toc-link" href="#7-3-安装-hexo-deployer-git"><span class="post-toc-number">1.7.3.</span> <span class="post-toc-text">7.3 安装 hexo-deployer-git</span></a></li><li class="post-toc-item post-toc-level-3"><a class="post-toc-link" href="#7-4-网站配置git"><span class="post-toc-number">1.7.4.</span> <span class="post-toc-text">7.4 网站配置git</span></a></li><li class="post-toc-item post-toc-level-3"><a class="post-toc-link" href="#7-5-部署"><span class="post-toc-number">1.7.5.</span> <span class="post-toc-text">7.5 部署</span></a></li></ol></li><li class="post-toc-item post-toc-level-2"><a class="post-toc-link" href="#8-贴标签，方便搜索"><span class="post-toc-number">1.8.</span> <span class="post-toc-text">8 贴标签，方便搜索</span></a><ol class="post-toc-child"><li class="post-toc-item post-toc-level-3"><a class="post-toc-link" href="#8-1-两个确认"><span class="post-toc-number">1.8.1.</span> <span class="post-toc-text">8.1 两个确认</span></a></li><li class="post-toc-item post-toc-level-3"><a class="post-toc-link" href="#8-2-新建tags页面"><span class="post-toc-number">1.8.2.</span> <span class="post-toc-text">8.2 新建tags页面</span></a></li><li class="post-toc-item post-toc-level-3"><a class="post-toc-link" href="#8-3-修改source-tags-index-md"><span class="post-toc-number">1.8.3.</span> <span class="post-toc-text">8.3 修改source/tags/index.md</span></a></li><li class="post-toc-item post-toc-level-3"><a class="post-toc-link" href="#8-4-在文章中添加tags"><span class="post-toc-number">1.8.4.</span> <span class="post-toc-text">8.4 在文章中添加tags</span></a></li></ol></li><li class="post-toc-item post-toc-level-2"><a class="post-toc-link" href="#9-分类，给文章归档"><span class="post-toc-number">1.9.</span> <span class="post-toc-text">9 分类，给文章归档</span></a><ol class="post-toc-child"><li class="post-toc-item post-toc-level-3"><a class="post-toc-link" href="#9-1-两个确认"><span class="post-toc-number">1.9.1.</span> <span class="post-toc-text">9.1 两个确认</span></a></li><li class="post-toc-item post-toc-level-3"><a class="post-toc-link" href="#9-2-新建categories文件"><span class="post-toc-number">1.9.2.</span> <span class="post-toc-text">9.2 新建categories文件</span></a></li><li class="post-toc-item post-toc-level-3"><a class="post-toc-link" href="#9-3-修改categories-index-md"><span class="post-toc-number">1.9.3.</span> <span class="post-toc-text">9.3 修改categories/index.md</span></a></li><li class="post-toc-item post-toc-level-3"><a class="post-toc-link" href="#9-4-在文章中添加categories"><span class="post-toc-number">1.9.4.</span> <span class="post-toc-text">9.4 在文章中添加categories</span></a></li></ol></li><li class="post-toc-item post-toc-level-2"><a class="post-toc-link" href="#10-添加评论功能"><span class="post-toc-number">1.10.</span> <span class="post-toc-text">10 添加评论功能</span></a><ol class="post-toc-child"><li class="post-toc-item post-toc-level-3"><a class="post-toc-link" href="#10-1-注册多说账号"><span class="post-toc-number">1.10.1.</span> <span class="post-toc-text">10.1 注册多说账号</span></a></li><li class="post-toc-item post-toc-level-3"><a class="post-toc-link" href="#10-2-创建站点"><span class="post-toc-number">1.10.2.</span> <span class="post-toc-text">10.2 创建站点</span></a></li><li class="post-toc-item post-toc-level-3"><a class="post-toc-link" href="#10-3-配置"><span class="post-toc-number">1.10.3.</span> <span class="post-toc-text">10.3 配置</span></a></li></ol></li><li class="post-toc-item post-toc-level-2"><a class="post-toc-link" href="#11使用hexo-help-live2d添加贴画"><span class="post-toc-number">1.11.</span> <span class="post-toc-text">11使用hexo-help-live2d添加贴画</span></a></li></ol></li></ol>
            <!--<div id="toc" class="toc-article">-->
                <!--<strong class="toc-title">文章目录</strong>-->
                <!--<ol class="toc"><li class="toc-item toc-level-1"><a class="toc-link" href="#Hexo-博客搭建指南"><span class="toc-number">1.</span> <span class="toc-text">Hexo 博客搭建指南</span></a><ol class="toc-child"><li class="toc-item toc-level-2"><a class="toc-link" href="#1-Hexo介绍"><span class="toc-number">1.1.</span> <span class="toc-text">1 Hexo介绍</span></a></li><li class="toc-item toc-level-2"><a class="toc-link" href="#2-环境准备"><span class="toc-number">1.2.</span> <span class="toc-text">2 环境准备</span></a><ol class="toc-child"><li class="toc-item toc-level-3"><a class="toc-link" href="#2-1-安装node-js"><span class="toc-number">1.2.1.</span> <span class="toc-text">2.1 安装node.js</span></a></li><li class="toc-item toc-level-3"><a class="toc-link" href="#2-2-安装hexo"><span class="toc-number">1.2.2.</span> <span class="toc-text">2.2 安装hexo</span></a></li></ol></li><li class="toc-item toc-level-2"><a class="toc-link" href="#3-利用Hexo搭建一个博客"><span class="toc-number">1.3.</span> <span class="toc-text">3 利用Hexo搭建一个博客</span></a><ol class="toc-child"><li class="toc-item toc-level-3"><a class="toc-link" href="#3-1-创建博客目录limedroid-github-io"><span class="toc-number">1.3.1.</span> <span class="toc-text">3.1 创建博客目录limedroid.github.io</span></a></li><li class="toc-item toc-level-3"><a class="toc-link" href="#3-2-生成静态页面"><span class="toc-number">1.3.2.</span> <span class="toc-text">3.2 生成静态页面</span></a></li><li class="toc-item toc-level-3"><a class="toc-link" href="#3-3-运行"><span class="toc-number">1.3.3.</span> <span class="toc-text">3.3 运行</span></a></li></ol></li><li class="toc-item toc-level-2"><a class="toc-link" href="#4-发一篇文章试试"><span class="toc-number">1.4.</span> <span class="toc-text">4 发一篇文章试试</span></a><ol class="toc-child"><li class="toc-item toc-level-3"><a class="toc-link" href="#4-1-命令方式"><span class="toc-number">1.4.1.</span> <span class="toc-text">4.1 命令方式</span></a></li><li class="toc-item toc-level-3"><a class="toc-link" href="#4-2-直接方式"><span class="toc-number">1.4.2.</span> <span class="toc-text">4.2 直接方式</span></a></li></ol></li><li class="toc-item toc-level-2"><a class="toc-link" href="#5-配置"><span class="toc-number">1.5.</span> <span class="toc-text">5 配置</span></a></li><li class="toc-item toc-level-2"><a class="toc-link" href="#6-换一个好看的主题"><span class="toc-number">1.6.</span> <span class="toc-text">6 换一个好看的主题</span></a><ol class="toc-child"><li class="toc-item toc-level-3"><a class="toc-link" href="#6-1-下载主题资源"><span class="toc-number">1.6.1.</span> <span class="toc-text">6.1 下载主题资源</span></a></li><li class="toc-item toc-level-3"><a class="toc-link" href="#6-2-应用下载的主题"><span class="toc-number">1.6.2.</span> <span class="toc-text">6.2 应用下载的主题</span></a></li><li class="toc-item toc-level-3"><a class="toc-link" href="#6-3-主题其他配置"><span class="toc-number">1.6.3.</span> <span class="toc-text">6.3 主题其他配置</span></a></li></ol></li><li class="toc-item toc-level-2"><a class="toc-link" href="#7-部署到Github"><span class="toc-number">1.7.</span> <span class="toc-text">7 部署到Github</span></a><ol class="toc-child"><li class="toc-item toc-level-3"><a class="toc-link" href="#7-1-有个github账号xxx"><span class="toc-number">1.7.1.</span> <span class="toc-text">7.1 有个github账号xxx</span></a></li><li class="toc-item toc-level-3"><a class="toc-link" href="#7-2-创建一个xxx-github-io的public仓库"><span class="toc-number">1.7.2.</span> <span class="toc-text">7.2 创建一个xxx.github.io的public仓库</span></a></li><li class="toc-item toc-level-3"><a class="toc-link" href="#7-3-安装-hexo-deployer-git"><span class="toc-number">1.7.3.</span> <span class="toc-text">7.3 安装 hexo-deployer-git</span></a></li><li class="toc-item toc-level-3"><a class="toc-link" href="#7-4-网站配置git"><span class="toc-number">1.7.4.</span> <span class="toc-text">7.4 网站配置git</span></a></li><li class="toc-item toc-level-3"><a class="toc-link" href="#7-5-部署"><span class="toc-number">1.7.5.</span> <span class="toc-text">7.5 部署</span></a></li></ol></li><li class="toc-item toc-level-2"><a class="toc-link" href="#8-贴标签，方便搜索"><span class="toc-number">1.8.</span> <span class="toc-text">8 贴标签，方便搜索</span></a><ol class="toc-child"><li class="toc-item toc-level-3"><a class="toc-link" href="#8-1-两个确认"><span class="toc-number">1.8.1.</span> <span class="toc-text">8.1 两个确认</span></a></li><li class="toc-item toc-level-3"><a class="toc-link" href="#8-2-新建tags页面"><span class="toc-number">1.8.2.</span> <span class="toc-text">8.2 新建tags页面</span></a></li><li class="toc-item toc-level-3"><a class="toc-link" href="#8-3-修改source-tags-index-md"><span class="toc-number">1.8.3.</span> <span class="toc-text">8.3 修改source/tags/index.md</span></a></li><li class="toc-item toc-level-3"><a class="toc-link" href="#8-4-在文章中添加tags"><span class="toc-number">1.8.4.</span> <span class="toc-text">8.4 在文章中添加tags</span></a></li></ol></li><li class="toc-item toc-level-2"><a class="toc-link" href="#9-分类，给文章归档"><span class="toc-number">1.9.</span> <span class="toc-text">9 分类，给文章归档</span></a><ol class="toc-child"><li class="toc-item toc-level-3"><a class="toc-link" href="#9-1-两个确认"><span class="toc-number">1.9.1.</span> <span class="toc-text">9.1 两个确认</span></a></li><li class="toc-item toc-level-3"><a class="toc-link" href="#9-2-新建categories文件"><span class="toc-number">1.9.2.</span> <span class="toc-text">9.2 新建categories文件</span></a></li><li class="toc-item toc-level-3"><a class="toc-link" href="#9-3-修改categories-index-md"><span class="toc-number">1.9.3.</span> <span class="toc-text">9.3 修改categories/index.md</span></a></li><li class="toc-item toc-level-3"><a class="toc-link" href="#9-4-在文章中添加categories"><span class="toc-number">1.9.4.</span> <span class="toc-text">9.4 在文章中添加categories</span></a></li></ol></li><li class="toc-item toc-level-2"><a class="toc-link" href="#10-添加评论功能"><span class="toc-number">1.10.</span> <span class="toc-text">10 添加评论功能</span></a><ol class="toc-child"><li class="toc-item toc-level-3"><a class="toc-link" href="#10-1-注册多说账号"><span class="toc-number">1.10.1.</span> <span class="toc-text">10.1 注册多说账号</span></a></li><li class="toc-item toc-level-3"><a class="toc-link" href="#10-2-创建站点"><span class="toc-number">1.10.2.</span> <span class="toc-text">10.2 创建站点</span></a></li><li class="toc-item toc-level-3"><a class="toc-link" href="#10-3-配置"><span class="toc-number">1.10.3.</span> <span class="toc-text">10.3 配置</span></a></li></ol></li><li class="toc-item toc-level-2"><a class="toc-link" href="#11使用hexo-help-live2d添加贴画"><span class="toc-number">1.11.</span> <span class="toc-text">11使用hexo-help-live2d添加贴画</span></a></li></ol></li></ol>-->
            <!--</div>-->
        </nav>
    </aside>




<article id="post-Hexo博客搭建指南" class="post-article article-type-post fade" itemprop="blogPost">

    <div class="post-card">
        <h1 class="post-card-title">Hexo 博客搭建指南</h1>
        <div class="post-meta">
            <time class="post-time" title="2020-03-29 21:44:22" datetime="2020-03-29T13:44:22.000Z" itemprop="datePublished">2020-03-29</time>

            
	<ul class="article-category-list"><li class="article-category-list-item"><a class="article-category-list-link" href="/categories/hexo/">hexo</a></li></ul>



            
<span id="busuanzi_container_page_pv" title="文章总阅读量" style="display:none">
    <i class="icon icon-eye icon-pr"></i><span id="busuanzi_value_page_pv"></span>
</span>


        </div>
        <div class="post-content" id="post-content" itemprop="postContent">
            <h1 id="Hexo-博客搭建指南"><a href="#Hexo-博客搭建指南" class="headerlink" title="Hexo 博客搭建指南"></a>Hexo 博客搭建指南</h1><h2 id="1-Hexo介绍"><a href="#1-Hexo介绍" class="headerlink" title="1 Hexo介绍"></a>1 Hexo介绍</h2><p><a href="https://hexo.io/zh-cn/" target="_blank" rel="noopener">Hexo</a>是基于<code>NodeJs</code>的静态博客框架，简单、轻量，其生成的静态网页可以托管在<code>Github</code>和<code>Heroku</code>上。</p>
<ul>
<li>超快速度</li>
<li>支持MarkDown</li>
<li>一键部署</li>
<li>丰富的插件</li>
</ul>
<blockquote>
<p>下面以我的博客为例，limedroid.github.io</p>
</blockquote>
<h2 id="2-环境准备"><a href="#2-环境准备" class="headerlink" title="2 环境准备"></a>2 环境准备</h2><h3 id="2-1-安装node-js"><a href="#2-1-安装node-js" class="headerlink" title="2.1 安装node.js"></a>2.1 安装node.js</h3><p>去<a href="https://nodejs.org/en/download/" target="_blank" rel="noopener">nodejs官网</a>下载对应系统的安装包，按提示安装。</p>
<p>检验安装成功：<br><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">$ node -v</span><br></pre></td></tr></table></figure></p>
<h3 id="2-2-安装hexo"><a href="#2-2-安装hexo" class="headerlink" title="2.2 安装hexo"></a>2.2 安装hexo</h3><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">$ npm install hexo-cli -g</span><br></pre></td></tr></table></figure>
<p>注意：Mac系统，则需要<br><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">$ sudo npm install hexo-cli -g</span><br></pre></td></tr></table></figure></p>
<h2 id="3-利用Hexo搭建一个博客"><a href="#3-利用Hexo搭建一个博客" class="headerlink" title="3 利用Hexo搭建一个博客"></a>3 利用Hexo搭建一个博客</h2><h3 id="3-1-创建博客目录limedroid-github-io"><a href="#3-1-创建博客目录limedroid-github-io" class="headerlink" title="3.1 创建博客目录limedroid.github.io"></a>3.1 创建博客目录<code>limedroid.github.io</code></h3><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">$ hexo init limedroid.github.io</span><br><span class="line">$ cd limedroid.github.io</span><br><span class="line">$ npm install</span><br></pre></td></tr></table></figure>
<h3 id="3-2-生成静态页面"><a href="#3-2-生成静态页面" class="headerlink" title="3.2 生成静态页面"></a>3.2 生成静态页面</h3><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">$ hexo clean</span><br><span class="line">$ hexo g</span><br></pre></td></tr></table></figure>
<blockquote>
<p>g 即generate</p>
</blockquote>
<h3 id="3-3-运行"><a href="#3-3-运行" class="headerlink" title="3.3 运行"></a>3.3 运行</h3><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">$ hexo s</span><br></pre></td></tr></table></figure>
<blockquote>
<p>s 即server</p>
</blockquote>
<p>然后打开浏览器，输入地址 <strong>localhost:4000</strong> 即可看到效果</p>
<h2 id="4-发一篇文章试试"><a href="#4-发一篇文章试试" class="headerlink" title="4 发一篇文章试试"></a>4 发一篇文章试试</h2><h3 id="4-1-命令方式"><a href="#4-1-命令方式" class="headerlink" title="4.1 命令方式"></a>4.1 命令方式</h3><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">$ hexo new test</span><br></pre></td></tr></table></figure>
<p>此时会在<code>source/_posts</code>目录下生成<code>test.md</code>文件，输入些许内容，然后保存.</p>
<p>生成下，看看效果</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">$ hexo clean</span><br><span class="line">$ hexo g</span><br><span class="line">$ hexo s</span><br></pre></td></tr></table></figure>
<p>访问 <strong>localhost:4000</strong> 即可</p>
<h3 id="4-2-直接方式"><a href="#4-2-直接方式" class="headerlink" title="4.2 直接方式"></a>4.2 直接方式</h3><p>在 <strong>source/_posts/</strong>下新建一个<code>.md</code>文件也可</p>
<h2 id="5-配置"><a href="#5-配置" class="headerlink" title="5 配置"></a>5 配置</h2><p>网站的设置大部分都在<strong>_config.yml</strong>文件中，详细配置可以查看<a href="https://hexo.io/zh-cn/docs/configuration.html" target="_blank" rel="noopener">官方文档</a></p>
<p>下面只列出简单常用配置</p>
<ul>
<li><strong>title</strong> -&gt; 网站标题</li>
<li><strong>subtitle</strong> -&gt; 网站副标题</li>
<li><strong>description</strong> -&gt; 网站描述</li>
<li><strong>author</strong> -&gt; 您的名字</li>
<li><strong>language</strong> -&gt; 网站使用的语言</li>
</ul>
<p>坑：<strong>进行配置时，需要在冒号:后加一个英文空格</strong></p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">title: Droidlover</span><br></pre></td></tr></table></figure>
<h2 id="6-换一个好看的主题"><a href="#6-换一个好看的主题" class="headerlink" title="6 换一个好看的主题"></a>6 换一个好看的主题</h2><p>Hexo 中有很多主题，可以在<a href="https://hexo.io/themes/" target="_blank" rel="noopener">官网</a>查看。<br>这里我推荐<a href="https://github.com/iissnan/hexo-theme-next" target="_blank" rel="noopener">hexo-theme-next</a>，下面列举更换主题的一般套路：</p>
<h3 id="6-1-下载主题资源"><a href="#6-1-下载主题资源" class="headerlink" title="6.1 下载主题资源"></a>6.1 下载主题资源</h3><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">$ git clone https://github.com/iissnan/hexo-theme-next themes/next</span><br></pre></td></tr></table></figure>
<h3 id="6-2-应用下载的主题"><a href="#6-2-应用下载的主题" class="headerlink" title="6.2 应用下载的主题"></a>6.2 应用下载的主题</h3><p>在网站配置文件<strong>_config.yml</strong>中，配置<strong>theme</strong></p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">theme: next</span><br></pre></td></tr></table></figure>
<blockquote>
<p>next是主题名称，具体的可查看主题的文档</p>
</blockquote>
<h3 id="6-3-主题其他配置"><a href="#6-3-主题其他配置" class="headerlink" title="6.3 主题其他配置"></a>6.3 主题其他配置</h3><p>可在<code>/theme/{theme}/_config.yml</code> 主题的配置文件下进行主题的配置。</p>
<p>接下来，可以执行万能的调试命令看看效果</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br></pre></td><td class="code"><pre><span class="line">$ hexo clean</span><br><span class="line">$ hexo g</span><br><span class="line">$ hexo s</span><br></pre></td></tr></table></figure>
<h2 id="7-部署到Github"><a href="#7-部署到Github" class="headerlink" title="7 部署到Github"></a>7 部署到Github</h2><h3 id="7-1-有个github账号xxx"><a href="#7-1-有个github账号xxx" class="headerlink" title="7.1 有个github账号xxx"></a>7.1 有个github账号xxx</h3><h3 id="7-2-创建一个xxx-github-io的public仓库"><a href="#7-2-创建一个xxx-github-io的public仓库" class="headerlink" title="7.2 创建一个xxx.github.io的public仓库"></a>7.2 创建一个xxx.github.io的public仓库</h3><p>如果您的账户名是limedroid,则需要创建一个limedroid.github.io的public仓库.</p>
<h3 id="7-3-安装-hexo-deployer-git"><a href="#7-3-安装-hexo-deployer-git" class="headerlink" title="7.3 安装 hexo-deployer-git"></a>7.3 安装 <a href="https://github.com/hexojs/hexo-deployer-git" target="_blank" rel="noopener">hexo-deployer-git</a></h3><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">$ npm install hexo-deployer-git --save</span><br></pre></td></tr></table></figure>
<h3 id="7-4-网站配置git"><a href="#7-4-网站配置git" class="headerlink" title="7.4 网站配置git"></a>7.4 网站配置git</h3><p>在网站的<code>_config.yml</code>中配置deploy</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">deploy:</span><br><span class="line">  type: git</span><br><span class="line">  repo: &lt;repository url&gt;</span><br><span class="line">  branch: [branch]</span><br></pre></td></tr></table></figure>
<blockquote>
<p><code>branch</code>为分支，默认为<code>master</code>,可以不配置<br><code>repo</code>为仓库地址，在github上新建仓库后，可复制此地址</p>
</blockquote>
<h3 id="7-5-部署"><a href="#7-5-部署" class="headerlink" title="7.5 部署"></a>7.5 部署</h3><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">$ hexo d</span><br></pre></td></tr></table></figure>
<blockquote>
<p>d 即deploy</p>
</blockquote>
<h2 id="8-贴标签，方便搜索"><a href="#8-贴标签，方便搜索" class="headerlink" title="8 贴标签，方便搜索"></a>8 贴标签，方便搜索</h2><h3 id="8-1-两个确认"><a href="#8-1-两个确认" class="headerlink" title="8.1 两个确认"></a>8.1 两个确认</h3><ul>
<li><p>确认站点配置文件有 </p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">tag_dir: tags</span><br></pre></td></tr></table></figure>
</li>
<li><p>确认主题配置文件有</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">tags: tags</span><br></pre></td></tr></table></figure>
</li>
</ul>
<h3 id="8-2-新建tags页面"><a href="#8-2-新建tags页面" class="headerlink" title="8.2 新建tags页面"></a>8.2 新建tags页面</h3><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">$ hexo new page tags</span><br></pre></td></tr></table></figure>
<p>此时会在<code>source/</code>下生成<code>tags/index.md</code>文件</p>
<h3 id="8-3-修改source-tags-index-md"><a href="#8-3-修改source-tags-index-md" class="headerlink" title="8.3 修改source/tags/index.md"></a>8.3 修改source/tags/index.md</h3><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">title: tags</span><br><span class="line">date: 2015-10-20 06:49:50</span><br><span class="line">type: &quot;tags&quot;</span><br><span class="line">comments: false</span><br></pre></td></tr></table></figure>
<blockquote>
<p>date 可保持系统生成的时间，<br><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">type: &quot;tags&quot;</span><br><span class="line">comments: false</span><br></pre></td></tr></table></figure></p>
</blockquote>
<p>很重要</p>
<h3 id="8-4-在文章中添加tags"><a href="#8-4-在文章中添加tags" class="headerlink" title="8.4 在文章中添加tags"></a>8.4 在文章中添加tags</h3><p>在文章<code>xx.md</code>中添加：</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">tags: </span><br><span class="line">	- Tag1</span><br><span class="line">	- Tag2</span><br><span class="line">	- Tag3</span><br></pre></td></tr></table></figure>
<p>多个Tag可按上面的格式添加。</p>
<p>其文件头部类似：</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br></pre></td><td class="code"><pre><span class="line">title: TagEditText</span><br><span class="line">date: 2016-11-19 10:44:25</span><br><span class="line">tags: </span><br><span class="line">	- Tag1</span><br><span class="line">	- Tag2</span><br><span class="line">	- Tag3</span><br></pre></td></tr></table></figure>
<h2 id="9-分类，给文章归档"><a href="#9-分类，给文章归档" class="headerlink" title="9 分类，给文章归档"></a>9 分类，给文章归档</h2><h3 id="9-1-两个确认"><a href="#9-1-两个确认" class="headerlink" title="9.1 两个确认"></a>9.1 两个确认</h3><ul>
<li><p>确认站点配置文件打开了</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">category_dir: categories</span><br></pre></td></tr></table></figure>
</li>
<li><p>确认主题配置文件打开了</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">categories: /categories</span><br></pre></td></tr></table></figure>
</li>
</ul>
<h3 id="9-2-新建categories文件"><a href="#9-2-新建categories文件" class="headerlink" title="9.2 新建categories文件"></a>9.2 新建categories文件</h3><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">$ hexo new page categories</span><br></pre></td></tr></table></figure>
<p>此时会在<code>source</code>目录下生成<code>categories/index.md</code>文件</p>
<h3 id="9-3-修改categories-index-md"><a href="#9-3-修改categories-index-md" class="headerlink" title="9.3 修改categories/index.md"></a>9.3 修改categories/index.md</h3><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">title: categories</span><br><span class="line">date: 2015-10-20 06:49:50</span><br><span class="line">type: &quot;categories&quot;</span><br><span class="line">comments: false</span><br></pre></td></tr></table></figure>
<blockquote>
<p>date 可保持系统生成的时间，<br><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">type: &quot;categories&quot;</span><br><span class="line">comments: false</span><br></pre></td></tr></table></figure></p>
</blockquote>
<p>很重要</p>
<h3 id="9-4-在文章中添加categories"><a href="#9-4-在文章中添加categories" class="headerlink" title="9.4 在文章中添加categories"></a>9.4 在文章中添加categories</h3><p>在文章xx.md中添加：</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br></pre></td><td class="code"><pre><span class="line">categories: </span><br><span class="line">	- cate</span><br></pre></td></tr></table></figure>
<p>其文件头部类似：</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br></pre></td><td class="code"><pre><span class="line">title: TagEditText</span><br><span class="line">date: 2016-11-19 10:44:25</span><br><span class="line">categories: </span><br><span class="line">	- cate</span><br></pre></td></tr></table></figure>
<h2 id="10-添加评论功能"><a href="#10-添加评论功能" class="headerlink" title="10 添加评论功能"></a>10 添加评论功能</h2><p>评论功能在国内一般使用<a href="http://duoshuo.com/" target="_blank" rel="noopener">多说</a>。</p>
<h3 id="10-1-注册多说账号"><a href="#10-1-注册多说账号" class="headerlink" title="10.1 注册多说账号"></a>10.1 注册<a href="http://duoshuo.com/" target="_blank" rel="noopener">多说</a>账号</h3><h3 id="10-2-创建站点"><a href="#10-2-创建站点" class="headerlink" title="10.2 创建站点"></a>10.2 创建站点</h3><p>需要注意的是，填写的<strong>多说域名</strong>不能更改，会在后面使用，在这里我配置成droidlover</p>
<h3 id="10-3-配置"><a href="#10-3-配置" class="headerlink" title="10.3 配置"></a>10.3 配置</h3><p>在hexo主题配置文件中搜索：<br><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">duoshuo_shortname</span><br></pre></td></tr></table></figure></p>
<p>，然后打开开关，配置成前面设置的多说域名，如下：<br><figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br></pre></td><td class="code"><pre><span class="line">duoshuo_shortname: droidlover</span><br></pre></td></tr></table></figure></p>
<p>有时，可能需要一段js</p>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br></pre></td><td class="code"><pre><span class="line">&lt;!-- 多说评论框 start --&gt;</span><br><span class="line">	&lt;div class=&quot;ds-thread&quot; data-thread-key=&quot;请将此处替换成文章在你的站点中的ID&quot; data-title=&quot;请替换成文章的标题&quot; data-url=&quot;请替换成文章的网址&quot;&gt;&lt;/div&gt;</span><br><span class="line">&lt;!-- 多说评论框 end --&gt;</span><br><span class="line">&lt;!-- 多说公共JS代码 start (一个网页只需插入一次) --&gt;</span><br><span class="line">&lt;script type=&quot;text/javascript&quot;&gt;</span><br><span class="line">var duoshuoQuery = &#123;short_name:&quot;droidlover&quot;&#125;;</span><br><span class="line">	(function() &#123;</span><br><span class="line">		var ds = document.createElement(&apos;script&apos;);</span><br><span class="line">		ds.type = &apos;text/javascript&apos;;ds.async = true;</span><br><span class="line">		ds.src = (document.location.protocol == &apos;https:&apos; ? &apos;https:&apos; : &apos;http:&apos;) + &apos;//static.duoshuo.com/embed.js&apos;;</span><br><span class="line">		ds.charset = &apos;UTF-8&apos;;</span><br><span class="line">		(document.getElementsByTagName(&apos;head&apos;)[0] </span><br><span class="line">		 || document.getElementsByTagName(&apos;body&apos;)[0]).appendChild(ds);</span><br><span class="line">	&#125;)();</span><br><span class="line">	&lt;/script&gt;</span><br><span class="line">&lt;!-- 多说公共JS代码 end --&gt;</span><br></pre></td></tr></table></figure>
<p>现在，你可以运行看下效果了:)</p>
<h2 id="11使用hexo-help-live2d添加贴画"><a href="#11使用hexo-help-live2d添加贴画" class="headerlink" title="11使用hexo-help-live2d添加贴画"></a>11使用hexo-help-live2d添加贴画</h2><figure class="image-bubble">
                <div class="img-lightbox">
                    <div class="overlay"></div>
                    <img src="https://img-blog.csdnimg.cn/20190213143852738.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dhbmdfMTIzX3p5,size_16,color_FFFFFF,t_70" alt="" title="">
                </div>
                <div class="image-caption"></div>
            </figure>
<ul>
<li>npm install –save hexo-helper-live2d</li>
<li>npm install live2d-widget-model-tororo</li>
<li>向Hexo的 _config.yml 文件添加配置</li>
</ul>
<figure class="highlight plain"><table><tr><td class="gutter"><pre><span class="line">1</span><br><span class="line">2</span><br><span class="line">3</span><br><span class="line">4</span><br><span class="line">5</span><br><span class="line">6</span><br><span class="line">7</span><br><span class="line">8</span><br><span class="line">9</span><br><span class="line">10</span><br><span class="line">11</span><br><span class="line">12</span><br><span class="line">13</span><br><span class="line">14</span><br><span class="line">15</span><br><span class="line">16</span><br></pre></td><td class="code"><pre><span class="line">live2d:</span><br><span class="line">  enable: true</span><br><span class="line">  scriptFrom: local</span><br><span class="line">  pluginRootPath: live2dw/</span><br><span class="line">  pluginJsPath: lib/</span><br><span class="line">  pluginModelPath: assets/</span><br><span class="line">  tagMode: false</span><br><span class="line">  debug: false</span><br><span class="line">  model:</span><br><span class="line">    use: live2d-widget-model-tororo</span><br><span class="line">  display:</span><br><span class="line">    position: right</span><br><span class="line">    width: 150</span><br><span class="line">    height: 300</span><br><span class="line">  mobile:</span><br><span class="line">    show: true</span><br></pre></td></tr></table></figure>
<p>然后下载模型，模型名称可以到这里参考，一些模型的预览可以在<a href="https://huaji8.top/post/live2d-plugin-2.0/" target="_blank" rel="noopener">这里</a>。</p>

        </div>

        <blockquote class="post-copyright">
    
    <div class="content">
        
<span class="post-time">
    最后更新时间：<time datetime="2020-03-30T03:11:49.109Z" itemprop="dateUpdated">2020-03-30 11:11:49</time>
</span><br>


        
    </div>
    
    <footer>
        <a href="http://springcloud.xn--ses554g">
            <img src="/img/123.png" alt="Edward">
            Edward
        </a>
    </footer>
</blockquote>

        


        <div class="post-footer">
            
	<ul class="article-tag-list"><li class="article-tag-list-item"><a class="article-tag-list-link" href="/tags/hexo/">hexo</a></li></ul>


            
<div class="page-share-wrap">
    

<div class="page-share" id="pageShare">
    <ul class="reset share-icons">
      <li>
        <a class="weibo share-sns" target="_blank" href="http://service.weibo.com/share/share.php?url=http://springcloud.xn--ses554g/2020/03/29/Hexo博客搭建指南/&title=《Hexo 博客搭建指南》 — Edward&pic=http://springcloud.xn--ses554g/img/123.png" data-title="微博">
          <i class="icon icon-weibo"></i>
        </a>
      </li>
      <li>
        <a class="weixin share-sns wxFab" href="javascript:;" data-title="微信">
          <i class="icon icon-weixin"></i>
        </a>
      </li>
      <li>
        <a class="qq share-sns" target="_blank" href="http://connect.qq.com/widget/shareqq/index.html?url=http://springcloud.xn--ses554g/2020/03/29/Hexo博客搭建指南/&title=《Hexo 博客搭建指南》 — Edward&source=" data-title=" QQ">
          <i class="icon icon-qq"></i>
        </a>
      </li>
      <li>
        <a class="facebook share-sns" target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=http://springcloud.xn--ses554g/2020/03/29/Hexo博客搭建指南/" data-title=" Facebook">
          <i class="icon icon-facebook"></i>
        </a>
      </li>
      <li>
        <a class="twitter share-sns" target="_blank" href="https://twitter.com/intent/tweet?text=《Hexo 博客搭建指南》 — Edward&url=http://springcloud.xn--ses554g/2020/03/29/Hexo博客搭建指南/&via=http://springcloud.xn--ses554g" data-title=" Twitter">
          <i class="icon icon-twitter"></i>
        </a>
      </li>
      <li>
        <a class="google share-sns" target="_blank" href="https://plus.google.com/share?url=http://springcloud.xn--ses554g/2020/03/29/Hexo博客搭建指南/" data-title=" Google+">
          <i class="icon icon-google-plus"></i>
        </a>
      </li>
    </ul>
 </div>



    <a href="javascript:;" id="shareFab" class="page-share-fab waves-effect waves-circle">
        <i class="icon icon-share-alt icon-lg"></i>
    </a>
</div>



        </div>
    </div>

    
<nav class="post-nav flex-row flex-justify-between">
  
    <div class="waves-block waves-effect prev">
      <a href="/2020/03/29/常见分布式全局唯一ID生成策略及算法的对比/" id="post-prev" class="post-nav-link">
        <div class="tips"><i class="icon icon-angle-left icon-lg icon-pr"></i> Prev</div>
        <h4 class="title">常见分布式全局唯一ID生成策略及算法的对比</h4>
      </a>
    </div>
  

  
    <div class="waves-block waves-effect next">
      <a href="/2018/12/14/Effective_java_003/" id="post-next" class="post-nav-link">
        <div class="tips">Next <i class="icon icon-angle-right icon-lg icon-pl"></i></div>
        <h4 class="title">【Effective java第二版整理】第三条： 用私有构造器或者枚举类型强化Singleton属性</h4>
      </a>
    </div>
  
</nav>



    











    <!-- Valine Comments -->
    <div class="comments vcomment" id="comments"></div>
    <script src="//cdn1.lncld.net/static/js/3.0.4/av-min.js"></script>
    <script src="//unpkg.com/valine@latest/dist/Valine.min.js"></script>
    <!-- Valine Comments script -->
    <script>
        var GUEST_INFO = ['nick','mail','link'];
        var guest_info = 'nick,mail,link'.split(',').filter(function(item){
          return GUEST_INFO.indexOf(item) > -1
        });
        new Valine({
            el: '#comments',
            notify: 'false' == 'true',
            verify: 'false' == 'true',
            appId: "NHOU6qcrdobSwD5wwUJJ31pQ-gzGzoHsz",
            appKey: "E0RJgPMPwkjfMBOA88EalSzJ",
            avatar: "mm",
            placeholder: "Just go go",
            guest_info: guest_info.length == 0 ? GUEST_INFO : guest_info,
            pageSize: "10"
        })
    </script>
    <!-- Valine Comments end -->







</article>



</div>

        <footer class="footer">
    <div class="top">
        <p>
    <span id="busuanzi_container_site_uv">
        站点总访客数：30<span id="busuanzi_value_site_uv"></span>
    </span>
    <span id="busuanzi_container_site_pv">
        站点总访问量：425<span id="busuanzi_value_site_pv"></span>
    </span>
</p>


        <p>
            
                <span><a href="/atom.xml" target="_blank" class="rss" title="rss"><i class="icon icon-lg icon-rss"></i></a></span>
            
            <span>博客内容遵循 <a rel="license" href="https://creativecommons.org/licenses/by-nc-sa/4.0/deed.zh">知识共享 署名 - 非商业性 - 相同方式共享 4.0 国际协议</a></span>
        </p>
    </div>
    <div class="bottom">
        <p><span>Edward &copy; 2017 - 2021</span>
            <span>
                
                Power by <a href="http://hexo.io/" target="_blank">Hexo</a> Theme <a href="https://github.com/yscoder/hexo-theme-indigo" target="_blank">indigo</a>
            </span>
        </p>
    </div>
</footer>

    </main>
    <div class="mask" id="mask"></div>
<a href="javascript:;" id="gotop" class="waves-effect waves-circle waves-light"><span class="icon icon-lg icon-chevron-up"></span></a>



<div class="global-share" id="globalShare">
    <ul class="reset share-icons">
      <li>
        <a class="weibo share-sns" target="_blank" href="http://service.weibo.com/share/share.php?url=http://springcloud.xn--ses554g/2020/03/29/Hexo博客搭建指南/&title=《Hexo 博客搭建指南》 — Edward&pic=http://springcloud.xn--ses554g/img/123.png" data-title="微博">
          <i class="icon icon-weibo"></i>
        </a>
      </li>
      <li>
        <a class="weixin share-sns wxFab" href="javascript:;" data-title="微信">
          <i class="icon icon-weixin"></i>
        </a>
      </li>
      <li>
        <a class="qq share-sns" target="_blank" href="http://connect.qq.com/widget/shareqq/index.html?url=http://springcloud.xn--ses554g/2020/03/29/Hexo博客搭建指南/&title=《Hexo 博客搭建指南》 — Edward&source=" data-title=" QQ">
          <i class="icon icon-qq"></i>
        </a>
      </li>
      <li>
        <a class="facebook share-sns" target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=http://springcloud.xn--ses554g/2020/03/29/Hexo博客搭建指南/" data-title=" Facebook">
          <i class="icon icon-facebook"></i>
        </a>
      </li>
      <li>
        <a class="twitter share-sns" target="_blank" href="https://twitter.com/intent/tweet?text=《Hexo 博客搭建指南》 — Edward&url=http://springcloud.xn--ses554g/2020/03/29/Hexo博客搭建指南/&via=http://springcloud.xn--ses554g" data-title=" Twitter">
          <i class="icon icon-twitter"></i>
        </a>
      </li>
      <li>
        <a class="google share-sns" target="_blank" href="https://plus.google.com/share?url=http://springcloud.xn--ses554g/2020/03/29/Hexo博客搭建指南/" data-title=" Google+">
          <i class="icon icon-google-plus"></i>
        </a>
      </li>
    </ul>
 </div>


<div class="page-modal wx-share" id="wxShare">
    <a class="close" href="javascript:;"><i class="icon icon-close"></i></a>
    <p>扫一扫，分享到微信</p>
    <img src="" alt="微信分享二维码">
</div>




    <script src="//cdn.bootcss.com/node-waves/0.7.4/waves.min.js"></script>
<script>
var BLOG = { ROOT: '/', SHARE: true, REWARD: false };


</script>

<script src="//unpkg.com/hexo-theme-material-indigo@latest/js/main.min.js"></script>


<div class="search-panel" id="search-panel">
    <ul class="search-result" id="search-result"></ul>
</div>
<template id="search-tpl">
<li class="item">
    <a href="{path}" class="waves-block waves-effect">
        <div class="title ellipsis" title="{title}">{title}</div>
        <div class="flex-row flex-middle">
            <div class="tags ellipsis">
                {tags}
            </div>
            <time class="flex-col time">{date}</time>
        </div>
    </a>
</li>
</template>

<script src="//unpkg.com/hexo-theme-material-indigo@latest/js/search.min.js" async></script>






<script async src="//busuanzi.ibruce.info/busuanzi/2.3/busuanzi.pure.mini.js"></script>





<script src="/live2dw/lib/L2Dwidget.min.js?094cbace49a39548bed64abff5988b05"></script><script>L2Dwidget.init({"pluginRootPath":"live2dw/","pluginJsPath":"lib/","pluginModelPath":"assets/","tagMode":false,"log":false,"model":{"jsonPath":"/live2dw/assets/hijiki.model.json"},"display":{"position":"right","width":200,"height":400},"mobile":{"show":false}});</script></body>
</html>
